<!--
 * @Author: 九璃怀特 1599130621@qq.com
 * @Date: 2023-10-20 09:39:49
 * @LastEditors: 九璃怀特 1599130621@qq.com
 * @LastEditTime: 2023-10-20 13:59:23
 * @FilePath: \vast-system\src\components\common\BaseHeader.vue
 * @Description: 
 -->
<script lang="ts">
export default {
  name: "BaseHeader",
};
</script>
<script setup lang="ts">
import { header } from '@/headerInterface/index.ts'
import { useRouter } from 'vue-router'
const routerHeaders = useRouter()?.options?.routes.filter((item: header)=> item.meta)
console.log(routerHeaders)
</script>

<template>
  <header
    class="navbar box-border relative flex justify-center items-center flex-col animate-iteration-1 animate-duration-1000 animate-fade-in border-b dark:border-cyan-950"
  >
    <nav>
      <ul>
        <li v-for="item in routerHeaders" :key="item.path">
          {{ item.meta.menuName }}
        </li>
      </ul>
    </nav>
  </header>
</template>

<style lang="less" scoped>
.navbar {
  box-sizing: border-box;
  border-bottom: var(--vast-default-border);
  backdrop-filter: saturate(50%) blur(6px);
  .navbar-wrapper {
    padding: 3px;
  }
}
</style>
